import 'package:fate_blind_box/network/Api.dart';
import 'package:fate_blind_box/theme/theme_color.dart';
import 'package:fate_blind_box/utils/loading.dart';
import 'package:flutter/material.dart';

class IndustryPage extends StatefulWidget {
  bool isFromUpload = false;
  Function? callBack;

  IndustryPage({Key? key, this.isFromUpload = false, this.callBack})
      : super(key: key);

  @override
  State<IndustryPage> createState() => _IndustryPageState();
}

class _IndustryPageState extends State<IndustryPage> {
  final _listData = [
    {"title": "餐饮", "isSelect": false},
    {"title": "影院", "isSelect": false},
    {"title": "咖啡厅", "isSelect": false},
    {"title": "酒吧", "isSelect": false},
    {"title": "健身房", "isSelect": false}
  ];
  int indexSelect = -1;

  @override
  Widget build(BuildContext context) {
    return Container(
      height: 300,
      decoration: const BoxDecoration(
          color: Colors.white,
          borderRadius: BorderRadius.only(
              topLeft: Radius.circular(8), topRight: Radius.circular(8))),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceAround,
        children: [
          Container(
            padding: const EdgeInsets.only(left: 20, top: 16, right: 20),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: [
                Opacity(
                  opacity: 0,
                  child: Image.asset(
                    'images/industry_cancel.png',
                    width: 14,
                    height: 14,
                  ),
                ),
                const Text(
                  '行业选择',
                  style: TextStyle(
                      color: Color(0xFF000000),
                      fontSize: 16,
                      fontWeight: FontWeight.w500),
                ),
                GestureDetector(
                  onTap: () {
                    Navigator.pop(context);
                  },
                  child: Opacity(
                    opacity: 1,
                    child: Image.asset(
                      'images/industry_cancel.png',
                      width: 14,
                      height: 14,
                    ),
                  ),
                )
              ],
            ),
          ),
          Expanded(
            child: Container(
                padding: const EdgeInsets.only(left: 57, right: 57),
                child: Wrap(
                  direction: Axis.vertical,
                  runSpacing: 14, //纵向间距
                  spacing: 20, //横向间距
                  children: List<Widget>.generate(_listData.length, (index) {
                    return _buildItem(index);
                  }).toList(),
                )),
          ),
          GestureDetector(
            onTap: () {
              if (indexSelect >= 0) {
                final choseTitle = _listData[indexSelect]['title'];
                if (widget.isFromUpload) {
                  if (widget.callBack != null) {
                    widget.callBack!(choseTitle);
                  }
                  Navigator.pop(context);
                } else {
                  print(choseTitle);
                  _submit(choseTitle.toString());
                }
              }
            },
            child: Container(
                width: 248,
                height: 45,
                decoration: BoxDecoration(
                    color: ThemeColor.appColor,
                    borderRadius: BorderRadius.circular(22)),
                child: const Center(
                  child: Text(
                    '保存',
                    style: TextStyle(
                        fontSize: 18,
                        color: Colors.white,
                        fontWeight: FontWeight.w500),
                  ),
                )),
          )
        ],
      ),
    );
  }

  void _submit(String trade) {
    loading(() async {
      final res = await Api.getInstance().uploadTrade(trade);
      toast(res['msg']);
      if (res['code'] == 0) {
        Navigator.pop(context, true);
      } else {
        Navigator.pop(context, false);
      }
    });
  }

  Widget _buildItem(int index) {
    return GestureDetector(
      onTap: () {
        // print(index);
        indexSelect = index;
        setState(() {
          for (var item in _listData) {
            // print(item['isSelect']);
            item['isSelect'] = false;
          }
          _listData[index]['isSelect'] = true;
        });
      },
      child: Container(
          width: 120,
          height: 38,
          decoration: BoxDecoration(
              borderRadius: const BorderRadius.all(Radius.circular(10)),
              border: Border.all(
                  width: 1,
                  color: _listData[index]['isSelect'] == false
                      ? const Color(0xFFD4D4D4)
                      : ThemeColor.appColor),
              color: _listData[index]['isSelect'] == false
                  ? Colors.white
                  : const Color(0xFFF2F0FB)),
          child: Center(
            child: Text(
              _listData[index]['title'].toString(),
              style: const TextStyle(fontSize: 16, color: Color(0xFF483939)),
            ),
          )),
    );
  }
}
